<template>
  <div class="threecolumnlist">
    <div
      v-for="(item, index) in items"
      :key="'threeColumnList_' + index"
      class="threecolumnlist_item"
    >
      <slot name="threeColumnItem" :item="item"></slot>
    </div>
  </div>
</template>
<script>
export default {
  name: "ThreeColumnList",
  props: {
    items: {
      type: Array,
      default() {
        return [];
      },
    },
  },
  data() {
    return {};
  },
};
</script>
<style lang="less">
@base: 23.44rem;
.threecolumnlist {
  display: block;
  margin: 5 / @base 0 0 5 / @base;
  overflow: hidden;
  .threecolumnlist_item {
    width: 33.3333%;
    float: left;
  }
}
</style>
